<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>hello vue</title>
<style type="text/css">

</style>
</head>
<body>







<div id="app">

	 <mycom2></mycom2>


</div>









<br>
<script src="vue.js"></script>
<script type="text/javascript">

  
//Vue.component第一个参数：组建的名称，在引用组件的时候，就是一个标签的形式来引入
//第二个参数为模板渲染的html内容
/*  Vue.component('mycom2',Vue.extend({
    template:'<h3>这是用template渲染出来的模板</h3>'
  }))

 */ 

//创建组建的第二种方式
  
  Vue.component("mycom2",{
    //当渲染的内容为两个时，Vue会不支持，因为Vue只维护一个根元素
    //使用这种方法来创建组件，遇到一个根元素时可以加个div包含即可
    // template:'<h3>这是用template渲染出来的模板</h3><span>123</span>'
    template:'<h3>这是用template渲染出来的模板</h3>'
  })




var vm = new Vue({
  el:"#app",

  data:{

  },
  
  methods:{

  },


})


</script>

	
</body>
</html>